<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="icon" href="/images/icon.jpg">
    <link rel="stylesheet" href="/css/bootstrap.min.css">
    <script src="/js/jquery-2.1.4.min.js"></script>
    <script src="/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/common.css">
    <link rel="stylesheet" href="/css/datetimepicker.css">
    <script src="/js/datetimepicker.js"></script>
    <style>
        .form_datetime {
            position: relative;
        }

        .add-on {
            float: right;
            /*position: absolute;*/
            /*width: 34px;*/
            /*height: 34px;*/
            right: 0px;
            top: 0px;
        }

        form .form-group .form_datetime .add-on .icon-remove {
            position: absolute;
            top:3px;
            right: 0px;
            height: 34px;
            width: 34px;
            /*outline: 1px solid red;*/
        }
        form .form-group .form_datetime .add-on .glyphicon-remove{
            padding-top: 3px;
            position: absolute;
            right: 0px;
            /*width: 34px;*/
            /*height: 34px;*/
            font-size: 32px;
        }

        form .form-group .form_datetime .add-on .icon-calendar {
            top: 5px;
            position: absolute;
            right: 37px;
            height: 34px;
            width: 34px;
            /*outline: 1px solid black;*/
        }
        form .form-group .form_datetime .add-on .glyphicon-calendar{
            padding-top: 3px;
            position: absolute;
            right: 37px;
            /*width: 34px;*/
            /*height: 34px;*/
            font-size: 32px;
        }


    </style>
</head>
<body>
<nav class="navbar navbar-default">
    <div class="container-fluid">
        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse"
                    data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="/index.html" class="navbar-brand logo">
                <img src="/images/icon.jpg" width="50px" alt="">
            </a>
            <a class="navbar-brand" href="/index.html">
                <span>义启行</span>
            </a>
        </div>

        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav">
                <li class="active"><a href="/index.html">首页<span class="sr-only">(current)</span></a></li>
                <li><a href="#">Link</a></li>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false">Dropdown <span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Action</a></li>
                        <li><a href="#">Another action</a></li>
                        <li><a href="#">Something else here</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">Separated link</a></li>
                        <li role="separator" class="divider"></li>
                        <li><a href="#">One more separated link</a></li>
                    </ul>
                </li>
            </ul>
            <form class="navbar-form navbar-left">
                <div class="form-group">
                    <input type="text" class="form-control" placeholder="Search">
                </div>
                <button type="submit" class="btn btn-default">Submit</button>
            </form>
            <ul class="nav navbar-nav navbar-right">
                <li><a href="/discussion.html">讨论</a></li>
                <li class="publish"><a href="/publish.html">分享</a></li>
                <li><a href="/recruit.html" class="recruitTab" style="display: none;">发布招募</a></li>
                <li class="authTab"><a href="/login.html">登录</a></li>
                <li class="authTab"><a href="/register.html">注册</a></li>
                <li class="dropdown user" style="display: none">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true"
                       aria-expanded="false">
                        <span>
                            <span>
                                <img class="avatarUrl img-circle" src="/images/adorable.jpg" alt="">
                            </span>
                            <span class="nickname"></span>
                        </span>
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <input type="hidden" value="-1" class="role">
                        <li><a href="/personal.html">个人信息</a></li>
                        <li><a href="/replies.html">回复我的</a></li>
                        <li><a href="/signupInfo.html">报名信息</a></li>
                        <li><a href="/logout">退出登录</a></li>
                    </ul>
                </li>
            </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<div class="container-fluid">
    <div class="row">
        <div class="col-md-2"></div>
        <div class="col-md-8">
            <form action="/publishRecruitment" method="post">
                <div class="form-group">
                    <label for="location">地址</label>
                    <input type="text" class="form-control" id="location" name="location"
                           placeholder="请输入详细民宿地址（以便帮助义工了解情况）">
                </div>
                <div class="form-group">
                    <label for="introduction">旅社简介</label>
                    <textarea name="introduction" id="introduction" class="form-control" rows="5"></textarea>
                </div>
                <div class="form-group">
                    <label for="startTime">请选择开始时间</label>
                    <div class="input-append date form_datetime ">
                        <input size="20" type="text" value="" id="startTime" name="startTime" readonly class="form-control">
                        <span class="add-on">
                            <span class="glyphicon glyphicon-remove"></span>
                            <i class="icon-remove"></i>
                        </span>
                        <span class="add-on">
                            <span class="glyphicon glyphicon-calendar"></span>
                            <i class="icon-calendar"></i>
                        </span>
                    </div>
                </div>
                <div class="form-group">
                    <label for="endTime">请选择结束时间</label>
                    <div class="input-append date form_datetime ">
                        <input size="20" type="text" value="" id="endTime" name="endTime" readonly class="form-control">
                        <span class="add-on">
                            <span class="glyphicon glyphicon-remove"></span>
                            <i class="icon-remove"></i>
                        </span>
                        <span class="add-on">
                            <span class="glyphicon glyphicon-calendar"></span>
                            <i class="icon-calendar"></i>
                        </span>
                    </div>
                </div>
                <div class="form-group">
                    <label for="numberOfPeople">招募人数</label>
                    <input type="number" name="numberOfPeople" id="numberOfPeople" class="form-control" min="0">
                </div>
                <div class="form-group">
                    <label for="requirement">招募要求</label>
                    <textarea name="requirement" id="requirement" class="form-control" rows="5"></textarea>
                </div>
                <div class="form-group">
                    <label for="workContent">工作内容</label>
                    <textarea name="workContent" id="workContent" class="form-control" rows="5"></textarea>
                </div>
                <div class="form-group">
                    <label for="additionalInfo">其他信息</label>
                    <textarea name="additionalInfo" id="additionalInfo" class="form-control" rows="5"></textarea>
                </div>
                <div class="form-group">
                    <input type="submit" class="form-control btn btn-success" style="line-height: 10px;"/>
                </div>
            </form>
        </div>
        <div class="col-md-2"></div>
    </div>
</div>


</body>

<script defer="defer">
    $.fn.datetimepicker.dates['zh-CN'] = {
        days: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六", "星期日"],
        daysShort: ["周日", "周一", "周二", "周三", "周四", "周五", "周六", "周日"],
        daysMin:  ["日", "一", "二", "三", "四", "五", "六", "日"],
        months: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
        monthsShort: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"],
        today: "今天",
        suffix: [],
        meridiem: ["上午", "下午"]
    };

    $(".form_datetime").datetimepicker({
        pickerPosition:"bottom-left",
        format:"yyyy-mm-dd",
        minView:"month",
        minValue:"day",
        maxValue:"decade",
        todayBtn:true,
        language:"zh-CN",
        // autofocus:true

    });
</script>
<script src="/js/common.js"></script>
<script>authenticate()</script>

</html>